"use client";

import Loading from "@/components/loading";
import {HashRouter, Route, Routes} from "react-router";
import React from "react";
import {Path} from "@/constant";
import {useEffect, useState} from "react";

// fix : ReferenceError: document is not defined
export const useHasHydrated = () => {
    const [hasHydrated, setHasHydrated] = useState<boolean>(false);
    useEffect(() => {
        setHasHydrated(true);
    }, []);

    return hasHydrated;
};


const HomePage = () => <div>{new Date().toLocaleDateString()}</div>

function HomeScreen() {
    return (
        <div>
            <Routes>
                <Route index element={<HomePage/>}/>
                <Route path={Path.Home} element={<HomePage/>}/>
            </Routes>
        </div>
    )
}

export default function Home() {
    if (!useHasHydrated()) {
        return <Loading/>;

    }
    return (
        <HashRouter>
            <HomeScreen/>
        </HashRouter>
    )
}